<%inherit file="framework.html"/>
    <h2>User Management</h2>
    <form action="/users" method="get" id="user-finder">
        <button type="submit">Look up for</button>
        <input type="text" name="q" id="q" value="${c.q}" />
    </form>
    % if len(c.users) > 0:
    <div id="user-browser">
        <table cellpadding="0" cellspacing="0" border="0">
            <tr>
                <th class="rspace">Remaining Space</th>
                <th class="username">Username</th>
                <th class="realname">Real name</th>
                <th class="email">E-mail address</th>
            </tr>
            % for user in c.users:
            <tr>
                <td class="rspace"><div><div style="width:${c.userUsageStat[user.username]}%;">
                    <span>${c.userUsageStat[user.username]}</span>
                </div></div></td>
                <td class="username"><a href="/users/${user.username}">${user.username}</a></td>
                <td class="realname">${user.realname}</td>
                <td class="email">${user.email}</td>
            </tr>
            % endfor
        </table>
    </div>
    % else:
    <p>
        To start looking for someone, query from the input box on the top-right corner.
    </p>
    % endif